import "./index.less";
import { BasicColumn, BasicTable, useTable } from "@/components/Table";
import { formatDate } from "@/utils/util";
import { Tag } from "antd";
import { useTranslation } from "react-i18next";

const index = ({ taskListByProcess }: any) => {
	const { t } = useTranslation();
	const en_vi = "task.todo";
	const formatTime = (timestamp: any) => {
		if (!timestamp) return `0 ${t(`${en_vi}.second`)}`;
		const seconds = parseInt((timestamp / 1000) % 60);
		const minutes = parseInt((timestamp / 60000) % 60);
		const hours = parseInt((timestamp / 3600000) % 60);
		if (hours) return `${hours}${t(`${en_vi}.hour`)}${minutes}${t(`${en_vi}.minute`)}`;
		if (minutes) return `${minutes}${t(`${en_vi}.minute`)}`;
		if (seconds) return `${seconds}${t(`${en_vi}.second`)}`;
	};
	const columns: BasicColumn[] = [
		{
			title: t(`${en_vi}.approvalNode`),
			dataIndex: "name"
		},
		{
			title: t(`${en_vi}.approver`),
			render: (_, record) => {
				return record.assigneeUser.nickname;
			}
		},
		{
			title: t(`${en_vi}.startTime`),
			dataIndex: "createTime",
			render: (time: any) => {
				if (!time) return "";
				return formatDate(new Date(time));
			}
		},
		{
			title: t(`${en_vi}.endTime`),
			dataIndex: "endTime",
			render: (time: any) => {
				if (!time) return "";
				return formatDate(new Date(time));
			}
		},
		{
			title: t(`${en_vi}.approvalStatus`),
			dataIndex: "status",
			render: (status: any) => {
				if (status == 1) {
					return <Tag color="processing">{t(`${en_vi}.inApproval`)}</Tag>;
				} else if (status == 2) {
					return <Tag color="success">{t(`${en_vi}.approved`)}</Tag>;
				} else {
					return <Tag color="error">{t(`${en_vi}.approvalNotApproved`)}</Tag>;
				}
			}
		},
		{
			title: t(`${en_vi}.approvalSuggestion`),
			dataIndex: "reason"
		},
		{
			title: t(`${en_vi}.timeConsuming`),
			dataIndex: "durationInMillis",
			render: (time: any) => {
				return formatTime(time);
			}
		}
	];
	const [register] = useTable({
		dataSource: taskListByProcess,
		columns,
		useSearchForm: false,
		showTableSetting: false,
		bordered: false
	});
	return (
		<div>
			<BasicTable register={register}></BasicTable>
		</div>
	);
};
export default index;
